<!-- pages/post/post.vue -->
<template>
	<view class="wrapper">
		<form @submit="handleSubmit">
			
			<view class="form-item">
				<text>动态内容:</text>
				<!-- 1. 改用 v-model 双向绑定输入框内容 -->
				<textarea 
					v-model="contentValue" 
					name="content" 
					placeholder="分享校园新鲜事..." 
				/>
			</view>
			
			<!-- (下节课再做图片上传) -->

			<!-- 2. 提交按钮 -->
			<button type="primary" form-type="submit" :loading="isLoading">
				{{isLoading ? '发布中...' : '立即发布'}}
			</button>
		</form>
	</view>
</template>

<script setup>
import { ref } from 'vue';

// 1. 初始化数据库"遥控器"
const db = uniCloud.database();

const isLoading = ref(false);
// 新增：定义 ref 变量绑定 textarea 内容
const contentValue = ref('');

// 2. 表单提交事件
const handleSubmit = async (e) => {
	// 改为从绑定的变量获取内容，而非表单事件对象
	const content = contentValue.value;
	
	// 简单验证
	if (!content.trim()) { // 增加 trim() 过滤空字符
		uni.showToast({ title: '内容不能为空', icon: 'error' });
		return;
	}
	
	isLoading.value = true;
	
	try {
		// 3. 【核心】向 'campus-posts' 表"添加" (add) 一条数据
		const res = await db.collection('campus-posts').add({
			content: content, // 动态内容
			like_count: 0, // 初始点赞为0
			// (真实项目还应包含用户信息，如 uni-id)
			publish_time: Date.now() // 发布时间
		});
		
		console.log('发布成功', res);
		
		// 4. 反馈用户
		uni.showToast({
			title: '发布成功！',
			icon: 'success'
		});
		
		// 5. 发布成功后清空输入框 (核心优化点)
		contentValue.value = '';
		
	} catch (err) {
		console.error('发布失败', err);
		uni.showToast({
			title: '发布失败，请重试',
			icon: 'error'
		});
	} finally {
		// 无论成功失败，都结束 loading
		isLoading.value = false;
	}
};
</script>

<style>
.wrapper {
	padding: 15px;
}
.form-item {
	margin-bottom: 15px;
}
.form-item text {
	font-weight: bold;
	display: block;
	margin-bottom: 5px;
}
.form-item textarea {
	width: 100%;
	height: 120px;
	padding: 10px;
	border: 1px solid #eee;
	border-radius: 5px;
	background-color: #fff;
	box-sizing: border-box;
}
</style>